<template>
<!--第一步-->
  <div id="app" v-bind:style="appDivStyle">
    <div class="context" ref="context">
      <div class="queryBox" ref="queryBox">
        <el-form :model="formQueryCondition" ref="form" size="mini">
          <!--查询条件-->
          <!-- 资产编号 -->
          <!-- <el-form-item
            :label="$t('assetsAudit.queryLabel.assetCode')"
            :label-width="queryformLabelWidth"
          >
            <el-input
              v-model.trim="formQueryCondition.keyId.val"
              class="queryItemStyle"
              clearable
              :placeholder="$t('assetsAudit.queryLabel.placeholderAssetCode')"
            ></el-input>
          </el-form-item> -->
          <!-- 资产名称 -->
          <!-- <el-form-item
            :label="$t('assetsAudit.queryLabel.assetName')"
            :label-width="queryformLabelWidth"
          >
            <el-input
              v-model.trim="formQueryCondition.assetName.val"
              class="queryItemStyle"
              clearable
              :placeholder="$t('assetsAudit.queryLabel.placeholderAssetName')"
            ></el-input>
          </el-form-item> -->
          <!-- 子资产编号 -->
          <el-row>
            <el-col :span="5">
              <el-form-item
                :label="$t('assetsAudit.queryLabel.subAssetCode')"
                :label-width="queryformLabelWidth"
              >
                <el-input
                  v-model.trim="formQueryCondition.subassetCode.val"
                  class="queryItemStyle"
                  clearable
                  :placeholder="$t('assetsAudit.queryLabel.placeholderSubAssetCode')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="5" :offset="1">
              <!-- 子资产名称 -->
              <el-form-item
                :label="$t('assetsAudit.queryLabel.subAssetName')"
                :label-width="queryformLabelWidth"
              >
                <el-input
                  v-model.trim="formQueryCondition.subassetName.val"
                  class="queryItemStyle"
                  clearable
                  :placeholder="$t('assetsAudit.queryLabel.placeholderSubAssetName')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="5" :offset="1">
              <!-- 清晰度 -->
              <el-form-item
                :label="$t('assetsCn.queryLabel.assets.definition')"
                :label-width="queryformLabelWidth"
              >
                <el-select v-model="formQueryCondition.subassetDefinition.val" class="queryItemStyle">
                  <el-option :label="$t('assetsCn.label.all')" value></el-option>
                  <el-option :value="drug.valueCode" :key="drug.valueCode" :label="drug.valueText"
                                    v-for="drug in Sharpness"></el-option>
                  <!-- <el-option :label="$t('assetsCn.queryLabel.assets.nomal')" value="PendingReview"></el-option>
                  <el-option :label="$t('assetsCn.queryLabel.assets.high')" value="AuditPass"></el-option>
                  <el-option :label="$t('assetsCn.queryLabel.assets.allhigh')" value="AuditFailed"></el-option>
                  <el-option :label="$t('assetsCn.queryLabel.assets.superall')" value="Discard"></el-option> -->
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="5" :offset="1">
              <!-- 审核状态 -->
              <el-form-item
                :label="$t('assetsCn.queryLabel.assets.isStatus')"
                :label-width="queryformLabelWidth"
              >
                <el-select v-model="formQueryCondition.approvalStatus.val" class="queryItemStyle">
                  <el-option :label="$t('assetsCn.label.all')" value></el-option>
                  <el-option :value="drug.valueCode" :key="drug.valueCode" :label="drug.valueText"
                                    v-for="drug in ApprovalStatus"></el-option>
                  <!-- <el-option :label="$t('assetsCn.queryLabel.assets.pendingReview')" value="PendingReview"></el-option>
                  <el-option :label="$t('assetsCn.label.auditPass')" value="AuditPass"></el-option>
                  <el-option :label="$t('assetsCn.label.auditFailed')" value="AuditFailed"></el-option>
                  <el-option :label="$t('assetsCn.queryLabel.assets.discard')" value="Discard"></el-option> -->
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>


          <!-- 按钮 -->
          <el-row>
            <el-col :span="24">
              <div style="text-align:right">
                <!--返回-->
                <el-form-item v-if="isNeedGoBack">
                    <el-button type="primary" @click="back" icon="el-icon-back">{{ $t('btnText.backBtnText') }}</el-button>
                <!-- </el-form-item> -->
                <!-- 新增 -->
                <!-- <el-form-item> -->
                  <el-button v-permission="{menuCode: menuCode,resourceCode: 'saveEpisodeBtnText'}" type="primary" @click="onNew('saveEpisodeBtnText')">{{ $t('assetsCn.btnText.newBtnText') }}</el-button>
                <!-- </el-form-item> -->
                <!-- 重置 -->
                <!-- <el-form-item> -->
                  <el-button v-permission="{menuCode: menuCode,resourceCode: 'resetEpisodeBtnText'}" type="primary" @click="onReset('form')">{{ $t('assetsCn.btnText.resetBtnText') }}</el-button>
                <!-- </el-form-item> -->
                <!-- 导入 -->
                <!-- <el-form-item>
                  <el-button v-permission="{menuCode: menuCode,resourceCode: 'importEpisodeBtnText'}" type="primary" @click="openUploadDlg" icon="el-icon-download" :loading="loading" >{{ $t('assetsCn.btnText.importBtnText') }}</el-button>
                </el-form-item> -->
                <!--导入模板下载-->
                <!-- <el-form-item>
                    <el-button type="primary" @click="downloadTemplate" icon="el-icon-download" :loading="loading">{{ $t('playManage.btnText.downloadTemplate') }}</el-button>
                </el-form-item> -->
                <!-- <el-form-item> -->
                    <el-button v-permission="{menuCode:menuCode,resourceCode:'exportEpisodeBtnText'}" type="primary" @click="onExport('exportEpisodeBtnText')" icon="el-icon-download" :loading="loading">{{ $t('tagManage.btnText.exportBtnText') }}</el-button>
                <!-- </el-form-item> -->
                <!-- 查询 -->
                <!-- <el-form-item> -->
                  <el-button v-permission="{menuCode: menuCode,resourceCode: 'queryEpisodeBtnText'}" type="primary" @click="onQuery('queryEpisodeBtnText')" icon="el-icon-search" :loading="loading" >{{ $t('assetsCn.btnText.queryBtnText') }}</el-button>
                </el-form-item>
              </div>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <!-- 列表 -->
      <div class="dataBox" ref="dataBox" >
        <!--第二步  v-if="isInit"-->
        <el-table
          v-if="isInit"
          ref="singleTable"
          :data="tableData"
          :height="tableHeight"
          @sort-change="sortChange"
          v-loading="loading"
          size="mini"
          style="width: 100%;"
          stripe="stripe"
          border="border"
        >

          <!-- 序号 -->
          <el-table-column
            type="index"
            width="50"
            fixed="left"
            :label="$t('assetsCn.table.xh')"
            align="center"
          ></el-table-column>
          <!-- 操作 -->
          <el-table-column :label="$t('assetsCn.table.op')" fixed="left" min-width="360">
            <template slot-scope="scope">
              <el-button v-permission="{menuCode: menuCode,resourceCode: 'editEpisodeBtnText'}" size="gv" icon="el-icon-edit" :loading="loading" @click="edit(scope.$index, scope.row,'editEpisodeBtnText')" >{{ $t('assetsCn.btnText.editBtnText') }}</el-button>
              <el-button v-permission="{menuCode: menuCode,resourceCode: 'detailsEpisodeBtnText'}" size="gv" icon="el-icon-tickets" :loading="loading" @click="editDetails(scope.$index, scope.row,'detailsEpisodeBtnText')" >{{ $t('assetsCn.btnText.detailsBtnText') }}</el-button>
              <el-button v-permission="{menuCode: menuCode,resourceCode: 'previewEpisodeBtnText'}" size="gv" icon="el-icon-caret-right" :loading="loading" >{{ $t('assetsCn.btnText.preview') }}</el-button>
              <el-button v-permission="{menuCode: menuCode,resourceCode: 'passEpisodeBtnText'}" size="gv" icon="el-icon-delete" type="danger" :loading="loading" @click="assetCancellation(scope.$index, scope.row,'passEpisodeBtnText')" >{{ $t('assetsCn.btnText.logoffBtnText') }}</el-button>
              <!--下发-->
              <el-button size="gv" icon="el-icon-delete" v-permission="{menuCode: menuCode, resourceCode: 'sendDeleteSub'}" type="danger" :loading="loading" @click="onSendDel(scope.$index, scope.row,'sendDeleteSub')" v-show="scope.row.distribute=='分发成功'">{{ $t('AssetIssuance.btnText.IssuedDel') }}</el-button>
              <el-button size="gv" icon="el-icon-delete" v-permission="{menuCode: menuCode, resourceCode: 'sendDeleteSub'}" type="danger" :loading="loading" @click="onSendUpdate(scope.$index, scope.row,'sendDeleteSub')" v-show="scope.row.distribute=='分发成功'">{{ $t('AssetIssuance.btnText.IssuedUpdate') }}</el-button>
            </template>
          </el-table-column>
          <!-- <el-table-column
            prop="keyId"
            min-width="160"
            fixed="left"
            label="keyId"
            sortable="custom"
            sort-by="keyId"
          ></el-table-column> -->
           <!-- 子资产编号 -->
          <el-table-column
            prop="subassetCode"
            min-width="160"
            fixed="left"
            :label="$t('assetsAudit.table.subAssetCode')"
            sortable="custom"
            sort-by="subassetCode"
          ></el-table-column>
          <!-- 子资产名称 -->
          <el-table-column
            prop="subassetName"
            min-width="160"
            fixed="left"
            :label="$t('assetsAudit.subAssets.subAssetName')"
            sortable="custom"
            sort-by="subassetName"
          ></el-table-column>
          <!-- 壳资产编号 -->
          <el-table-column
            prop="assetEntity.assetCode"
            min-width="160"
            ref="assetEntityAssetCode"
            :label="$t('assetsAudit.assetCode')"
            sortable="custom"
            sort-by="assetEntity.assetCode"
          ></el-table-column>
          <!-- 壳资产名称 -->
          <el-table-column
            prop="assetEntity.assetName"
            min-width="160"
            :label="$t('assetsAudit.assetName')"
            sortable="custom"
            sort-by="assetEntity.assetName"
          ></el-table-column>
          <!-- 类型 -->
          <!-- <el-table-column
            prop="assetType"
            min-width="95"
            sortable="custom"
            :label="$t('assetsCn.table.assets.genre')"
            sort-by="assetType"
          ></el-table-column> -->
          <!-- 时长 -->
          <el-table-column
            prop="timeLength"
            min-width="95"
            sortable="custom"
            :label="$t('assetsCn.table.assets.timeLength')"
            sort-by="timeLength"
          ></el-table-column>
          <!-- 集数 -->
          <el-table-column
            :label="$t('assetsCn.table.assets.itemNum')"
            min-width="95"
            sortable="custom"
            prop="subassetNum"
            sort-by="subassetNum"
          ></el-table-column>
          <!-- 清晰度 -->
          <el-table-column
            :label="$t('assetsCn.table.assets.sharpness')"
            min-width="95"
            sortable="custom"
            prop="subassetDefinition"
            sort-by="subassetDefinition"
          ></el-table-column>
          <!-- 状态 -->
          <el-table-column
            :label="$t('assetsCn.table.assets.status')"
            min-width="140"
            sortable="custom"
            prop="approvalStatus"
            sort-by="approvalStatus"
          ></el-table-column>
          <!-- 下发状态 -->
          <el-table-column
            :label="$t('assetsCn.table.assets.sendtoState')"
            min-width="140"
            sortable="custom"
            prop="distribute"
            sort-by="distribute"
          ></el-table-column>
          <!-- 更新时间 -->
          <!-- <el-table-column
            :label="$t('assetsCn.table.assets.updateTime')"
            min-width="180"
            sortable="custom"
            prop="lastUpdateTime"
            sort-by="lastUpdateTime"
          ></el-table-column> -->
        </el-table>
      </div>
    </div>
    <div class="pageBox">
      <el-pagination
        @size-change="sizeChange"
        @current-change="currentPageChange"
        :current-page="pager.curPage"
        :page-sizes="pager.sizes"
        :page-size="pager.curSize"
        :background="true"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pager.total"
      ></el-pagination>
    </div>


   <!--编辑对话框-->
    <el-dialog :title="$t('assetsCn.label.dialogTitle')" :visible.sync="isShowEditForm" top="5vh" :close-on-click-modal="false">
      <el-form
        :model="editForm"
        ref="editForm"
        size="mini"
        :label-position="editFormPosition"
        status-icon="status-icon"
        :rules="editRules"
      >
      <!-- 资产编号 -->
        <el-form-item
          :label="$t('assetsAudit.assetCode')"
          :label-width="editformLabelWidth"
          prop="assetId"
        >
        <el-input
            v-model.trim="assetCode"
            :disabled="display"
            maxlength="20"
            :placeholder="$t('assetsAudit.queryLabel.placeholderAssetCode')"
          ></el-input>
          <el-input
            v-model.trim="editForm.assetId"
            maxlength="20" v-show="false"
            :placeholder="$t('assetsAudit.queryLabel.placeholderAssetCode')"
          ></el-input>
        </el-form-item>
        <!-- 资产名称 -->
        <el-form-item
          :label="$t('assetsAudit.assetName')"
          :label-width="editformLabelWidth"
          prop="assetName"
        >
          <el-input
            v-model.trim="assetName"
            :disabled="display"
            maxlength="20"
            :placeholder="$t('assetsAudit.queryLabel.placeholderAssetName')"
          ></el-input>
        </el-form-item>
      <!-- 剧集编号 -->
        <!-- <el-form-item
          v-show="isShow"
          :label="$t('assetsAudit.queryLabel.subAssetCode')"
          :label-width="editformLabelWidth"
          prop="subassetCode"
        >
          <el-input
            v-model.trim="editForm.subassetCode"
            maxlength="20"
            :placeholder="$t('assetsAudit.queryLabel.placeholderSubAssetCode')"
          ></el-input>
        </el-form-item> -->
        <!-- 剧集名称 -->
        <el-form-item
          :label="$t('assetsAudit.queryLabel.subAssetName')"
          :label-width="editformLabelWidth"
          prop="subassetName"
        >
          <el-input
            v-model.trim="editForm.subassetName"
            maxlength="50"
            :placeholder="$t('assetsAudit.queryLabel.placeholderSubAssetName')"
          ></el-input>
        </el-form-item>
        <!-- 集数 -->
        <el-form-item
          :label="$t('assetsCn.editLabel.assets.itemNum')"
          :label-width="editformLabelWidth"
          prop="subassetNum"
        >
          <el-input
            v-model.trim="editForm.subassetNum"
            maxlength="8"
            :placeholder="$t('assetsCn.editLabel.assets.placeholderEpisode')"
          ></el-input>
        </el-form-item>
        <!-- 清晰度 -->
        <el-form-item
          :label="$t('assetsCn.editLabel.assets.definition')"
          :label-width="editformLabelWidth"
          prop="subassetDefinition"
        >
          <el-select v-model.trim="editForm.subassetDefinition" maxlength="50">
            <!-- <el-option :label="$t('assetsCn.label.all')" value></el-option> -->
            <el-option :value="drug.valueCode" :key="drug.valueCode" :label="drug.valueText"
                                v-for="drug in Sharpness"></el-option>
          </el-select>
        </el-form-item>
        <!--是否免费-->
        <el-form-item :label="$t('assetsCn.editLabel.assets.isFee')" :label-width="editformLabelWidth" prop="isFee">
            <el-select v-model="editForm.isFee">
                <el-option :value="drug.valueCode" :key="drug.valueCode" :label="drug.valueText"
                        v-for="drug in isFeeData"></el-option>
            </el-select>
        </el-form-item>
        <!--内容类型-->
        <el-form-item :label="$t('assetsCn.editLabel.assets.contentType')" :label-width="editformLabelWidth" prop="contentType">
            <el-select v-model="editForm.contentType">
                <el-option :value="drug.valueCode" :key="drug.valueCode" :label="drug.valueText"
                        v-for="drug in contentTypeData"></el-option>
            </el-select>
        </el-form-item>
        <!-- 绝对播放地址 -->
        <el-form-item
          :label="$t('assetsCn.editLabel.assets.absoluteAddress')"
          :label-width="editformLabelWidth"
          prop="absoluteUrl"
        >
          <el-input
            v-model.trim="editForm.absoluteUrl"
            maxlength="2000"
            :placeholder="$t('assetsCn.editLabel.assets.placeholderAbsoluteAddress')"
          ></el-input>
        </el-form-item>
        <!-- 时长 -->
        <el-form-item
          :label="$t('assetsCn.editLabel.assets.timeLength')"
          :label-width="editformLabelWidth"
          prop="timeLength"
        >
          <el-input
            v-model.trim="editForm.timeLength"
            maxlength="50"
            :placeholder="$t('assetsCn.editLabel.assets.placeholderTimeLength')"
          ></el-input>
        </el-form-item>
        <!-- 文件大小 -->
        <el-form-item
          :label="$t('assetsCn.editLabel.assets.fileSize')"
          :label-width="editformLabelWidth"
          prop="fileSize"
        >
          <el-input
            v-model.trim="editForm.fileSize"
            maxlength="50"
            :placeholder="$t('assetsCn.editLabel.assets.placeholderFileSize')"
          ></el-input>
        </el-form-item>
        <!--编码格式-->
        <el-form-item :label="$t('assetsCn.editLabel.assets.videoType')" :label-width="editformLabelWidth" prop="videoType">
            <el-select v-model="editForm.videoType">
                <el-option :value="drug.valueCode" :key="drug.valueCode" :label="drug.valueText"
                        v-for="drug in videoTypeData"></el-option>
            </el-select>
        </el-form-item>
        <!--视频横图海报-->
        <el-form-item :label="$t('assetsCn.editLabel.assets.albumHorpic')" :label-width="editformLabelWidth" prop="videoHorpic">
            <el-input v-model.trim="editForm.videoHorpic"  width="120" v-show="false"></el-input>
            <el-upload
                class="avatar-uploader"
                :action="action"
                :show-file-list="false"
                :on-success="handleAvatarSuccess"
                :before-upload="beforeAvatarUpload">
                <img v-if="imageUrl" :src="imageUrl" class="avatar">
                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button
          size="mini"
          @click="isShowEditForm = false"
          :loading="loading"
        >{{ $t('assetsCn.btnText.cancelBtnText') }}</el-button>
        <el-button
          size="mini"
          type="primary"
          @click="submitForm('editForm',currentResCode)"
          :loading="loading"
        >{{ $t('assetsCn.btnText.saveBtnText') }}</el-button>
      </div>
    </el-dialog>

    <!--详情框-->
    <!-- <el-dialog :title="$t('assetsCn.label.dialogTitle')" :visible.sync="isShowDetails" top="5vh" width="60%">

    </el-dialog> -->
    <el-dialog :title="$t('label.dialogDetails')" :visible.sync="isShowDetails" top="5vh" width="60%" @close="renewRecord" :close-on-click-modal="false">
      <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
        <el-tab-pane :label="$t('assetsAudit.subAssets.details')" name="first">
                <subAssets-info :datas="dataForm"></subAssets-info>
        </el-tab-pane>
        <el-tab-pane :label="$t('assetsAudit.auditRecord')" name="second">
                <audit-record :datas="reviewQueryCondition" ref="auditRecord"></audit-record>
        </el-tab-pane>
        </el-tabs>
    </el-dialog>
  </div>
</template>

<script>
import comBaseVue from "../../baseViewModel";
import subAssetsInfo from '../audit/SubAssetsInfo';
import auditRecord from  '../audit/AuditRecord';

export default {
  mixins: [comBaseVue],
  name: "Assets", //资产管理中的剧集页面
  props: {
    isNeedGoBack:Boolean,
    curRootAssets: String,
    curRootAssetsCode: String,
    curRootAssetsName: String,
    menuCode: String
  },
  data() {
    return {
      //第三步
        isInit:false,
        display:true,
        tableHeight:200,
        activeName: 'first',
        //编辑布局
        //标题
        titleSpan:24,
        labelSpan:3,
        dataSpan:9,
        Sharpness:[],
        ApprovalStatus: [],
        contentTypeData: [],//内容类型
        videoTypeData: [],//编码格式类型
        isFeeData: [],//是否免费
        imageUrl: "",//"海报地址"
      // tableHeight: this.$store.getters.appHeightNum - 176 + 33,
        appDivStyle:{
            height:this.$store.getters.appHeight,
        },
      modelName:"com.ispr.iptv.entity.media.SubAssetEntity",
      // 查询条件
      formQueryCondition: {

        assetId: {
          //mapName: 'code',  映射的别名 在同时查询一个属性时需要别名
          //gName:'code',   组名
          key:"assetId",
          op: "=", // 操作符
          val: this.curRootAssets// 查询的值
        },
        subassetCode: {
          key:"subassetCode",
           op: "LIKE", // 操作符
          val: ""
        },
        subassetName: {
          key:"subassetName",
           op: "LIKE", // 操作符
          val: ""
        },
        subassetDefinition: {
          key:"subassetDefinition",
           op: "=", // 操作符
          val: ""
        },
        approvalStatus: {
          key:"approvalStatus",
           op: "=", // 操作符
          val: ""
        },
        isEnable:{
          key: "isEnable",
          op: "=",
          val: "Available"
          }
      },

      // 编辑面板绑定的对象
      editForm: {
        keyId: 0,
        version: 0,
        //assetCode: "",
        //assetName: "",
        timeLength:"",
        assetId:"",
        subassetCode: "",
        subassetName: "",
        subassetNum: "",
        subassetDefinition: "",
        absoluteUrl: "",
        sendtoState:"StayDown",
        isFee: "",
        contentType: "",
        videoHorpic: "",
        fileSize: "",
        videoType: "",
      },
      dataForm: {
            keyId: 0,
            version: 0,
            subassetCode: "",
            subassetName: "",
            assetType: "",
            subassetNum: "",
            approvalStatus:"",
            subassetDefinition:"",
            createdDate:"",
            absoluteUrl:"",
        },
      assetCode:"",
      assetName:"",
      // 编辑面板的验证规则
      editRules: {
        assetId: [
          {
            required: true,
            message: this.$i18n.t("assetsAudit.rules.assetCode"),
            trigger: "blur"
          }
        ],
        // assetName: [
        //   {
        //     required: true,
        //     message: this.$i18n.t("assetsAudit.rules.assetName"),
        //     trigger: "blur"
        //   }
        // ],
        subassetCode: [
          {
            required: true,
            message: this.$i18n.t("assetsCn.rules.assets.subAssetCode"),
            trigger: "blur"
          }
        ],
        subassetName: [
          {
            required: true,
            message: this.$i18n.t("assetsCn.rules.assets.subAssetName"),
            trigger: "blur"
          }
        ],
        // association: [
        //   {
        //     required: true,
        //     message: this.$i18n.t("assetsCn.rules.assets.association"),
        //     trigger: "blur"
        //   }
        // ],
        subassetNum: [
          {
            required: true,
            message: this.$i18n.t("assetsCn.rules.assets.itemNum"),
            trigger: "blur"
          }
        ],
        timeLength: [
          {
            required: true,
            message: this.$i18n.t("assetsCn.rules.assets.timeLength"),
            trigger: "blur"
          }
        ],
        subassetDefinition: [
          {
            required: true,
            message: this.$i18n.t("assetsCn.rules.assets.placeholderDefinition"),
            trigger: "change"
          }
        ],
        absoluteUrl: [
          {
            required: true,
            message: this.$i18n.t("assetsCn.rules.assets.placeholderAbsoluteAddress"),
            trigger: "blur"
          }
        ],
        isFee: [
          {
            required: true,
            message: this.$i18n.t("assetsAudit.placeholderIsFee"),
            trigger: "change"
          }
        ],
        contentType: [
          {
            required: true,
            message: this.$i18n.t("assetsAudit.placeholderContentType"),
            trigger: "change"
          }
        ],
        videoHorpic: [
          {
            required: true,
            message: this.$i18n.t("assetsAudit.placeholderAlbumHorpic"),
            trigger: "change"
          }
        ]
      },
      reviewQueryCondition: {
          code: {
              key: 'reviewDataId',
              op: '=', // 操作符
              val: ''
          },
          type: {
              key: 'reviewDataType',
              op: '=', // 操作符
              val: ''
          },
          assetName: {
              key: 'subassetName',
              op: '=',
              val: ''
          },

      },
      UpdateOrSave:"",
    //   详情框是否显示
        isShowDetails: false,
        isShow: true,
    //   声明详情框
        editDetailsForm:{assetEntity:""},
    // 排序对象
        sort: {
            key: "subassetNum",
            dir: "asc"
        },
        //下发
        sendForm: {
            siteList: [],//下发到的站点
            sendType:"",
        },
    };
  },
  methods: {
    // 新增
    onNew: function(rescode) {
      this.currentResCode = (rescode && rescode!=='') ? rescode : '';
      this.isShowEditForm = true;
      if (this.$refs["editForm"]) {
        this.$refs["editForm"].resetFields();
      }
      this.editForm.keyId = "";
      this.editForm.version = "";
      // this.editForm.shellCode = "";
      // this.editForm.shellName = "";
      this.assetCode = this.curRootAssetsCode;
      this.editForm.assetId = this.curRootAssets;
      this.assetName = this.curRootAssetsName;
      this.editForm.subassetCode = "";
      this.editForm.subassetName = "";
      this.editForm.subassetNum = "";
      this.editForm.subassetDefinition = "";
      this.editForm.absoluteUrl = "";
      this.editForm.timeLength = "";
      this.editForm.isFee = "";
      this.editForm.contentType = "";
      this.editForm.videoHorpic = "";
      this.editForm.fileSize = "";
      this.editForm.videoType = "";
      this.imageUrl = "";
      this.editForm.approvalStatus = "PendingReview";
      this.editForm.isEnable = "Available";
      // this.editForm.isEnabled = "Available";
      // this.isShow = false;
      this.UpdateOrSave = "/api/subAsset/save";
      // this.curCommand = "SaveNewReturnPK";
      this.canEditCode = false;
    },
    //上传成功时触发
    handleAvatarSuccess(res, file) {
        //alert(res.data);
        //alert(URL.createObjectURL(file.raw));
        this.imageUrl = res.data;
        this.editForm.videoHorpic = res.data;
    },
    //上传前的校验
    beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg';
        const isLt2M = file.size / 1024 / 1024 < 1;

        if (!isJPG) {
          this.$message.error('上传图片只能是 JPG 格式!');
        }
        if (!isLt2M) {
          this.$message.error('上传图片大小不能超过 1MB!');
        }
        return isJPG && isLt2M;
    },
    // 重置
    onReset: function() {
      if (this.$refs["form"]) {
        this.$refs["form"].resetFields();
      }
      //this.formQueryCondition.assetCode.val = "";
      //this.formQueryCondition.assetName.val = "";

      this.formQueryCondition.subassetCode.val = "";
      this.formQueryCondition.subassetName.val = "";
      this.formQueryCondition.subassetDefinition.val = "";
      this.formQueryCondition.approvalStatus.val = "";
    },

     // 提交编辑面板数据
    submitForm: function (formName) {
        var _this = this;
        //this.setEditFormCheck();
        this.$refs[formName].validate(function (valid) {
            if (valid) {
                _this.loading = true;
                _this.procControllerSave(
                    _this.curCommand,
                    _this.modelName,
                    "Default",
                    _this.editForm,
                    _this.submitFormCallbackSave);
            } else {
                return false;
            }
        });
    },
    procControllerSave: function(commandCode, className, commandArgs, commandBody,callback) {
        var requestArgs = {
            commandCode: commandCode,
            className: className,
            commandArgs: commandArgs,
            commandBody: commandBody,
            userInfo: this.getUserInfo()
        };
        if (this.isExistResourceCode(this)) {
            this.headersObj['X-AOHO-Resource'] = this.menuCode + ',' + this.currentResCode;
        };
        this.axios.post(this.UpdateOrSave,
                requestArgs, {headers: this.headersObj})
            .then(function(res) {
                if (res.data.code == "SUCCESS") {
                    callback.call(this, true, res.data.data);
                } else {
                    callback.call(this, false, res.data);
                }
            })
            .catch(function(error) {
                console.log(error);
                callback.call(this, false, "serverError");
            });
    },

    // 执行命令后的回调函数
    submitFormCallbackSave: function (isSuccess,json) {
        this.loading = false;
        if(isSuccess){
            this.isShowEditForm = false;
            this.$message({
                message: this.$i18n.t("message.successTip"),//resource.message.successTip,
                type: 'success'
            });
            this.queryTable();
        }
        else
        {
            this.$message({
                            message: this.$i18n.t("errorCode." + json.msg),
                            type: 'warning'
                            });
        }
    },
    // 剧集注销按钮
    assetCancellation: function(index, row, rescode) {

        this.currentResCode = (rescode && rescode!=='') ? rescode : '';
        var _this = this;
        this.$confirm(this.$i18n.t("message.confirmlogoffMessage"),
            this.$i18n.t("message.confirmTitle"), {
            confirmButtonText: this.$i18n.t("message.yes"),
            cancelButtonText: this.$i18n.t("message.cancel"),
            type: "warning",
            callback: function (action, instance) {
                if (action == "confirm") {

                    var commandBody = {  "keyId": row.keyId,"assetId":row.assetId, "version": row.version, isEnable: "Invalid" };
                    // var commandBody = {
                    //     data: [{ keyID: row.keyID, ver: row.version }],
                    //     val: "Invalid",
                    //     count: 1
                    // };
                    _this.loading = true;
                    _this.procCommand("assetCancellationProc",//"ChangeIsEnabledState",
                            _this.modelName,
                            "N",
                            commandBody,
                            null,
                            _this.submitFormCallback);
                }

            }
        });
    },
      // 注销按钮
        logoffRow: function(index, row, rescode) {

            this.currentResCode = (rescode && rescode!=='') ? rescode : '';
            var _this = this;
            this.$confirm(this.$i18n.t("message.confirmlogoffMessage"),
                this.$i18n.t("message.confirmTitle"), {
                confirmButtonText: this.$i18n.t("message.yes"),
                cancelButtonText: this.$i18n.t("message.cancel"),
                type: "warning",
                callback: function (action, instance) {
                    if (action == "confirm") {

                        var commandBody = {  "keyId": row.keyId,"assetId":row.assetId, "version": row.version, isEnable: "Invalid" };
                        // var commandBody = {
                        //     data: [{ keyID: row.keyID, ver: row.version }],
                        //     val: "Invalid",
                        //     count: 1
                        // };
                        _this.loading = true;
                        _this.procCommand("assetCancellationProc",//"ChangeIsEnabledState",
                                _this.modelName,
                                "N",
                                commandBody,
                                null,
                                _this.submitFormCallback);
                    }

                }
            });
        },
         // 执行命令后的回调函数
        submitFormCallback: function submitFormCallback(isSuccess,json) {
            this.currentResCode = '';
            this.loading = false;
            if(isSuccess){
                this.isShowEditForm = false;
                this.$message({
                    message: this.$i18n.t("message.successTip"),//resource.message.successTip,
                    type: 'success'
                });
                this.queryTable();
            }
            else
            {
                this.$message({
                                message: this.$i18n.t("errorCode." + json.msg),
                                type: 'warning'
                                });
            }
        },
    // 授权按钮单击事件
    // editMenu: function(index, row) {},

     // 编辑按钮单击事件
    edit: function(index, row,rescode) {
      this.currentResCode = (rescode && rescode!=='') ? rescode : '';
      //dataAccess.queryDomainModelByKeyID(this, modelName, "Query", row.keyID, true, this.$options.methods.editCallback);
      this.queryModelByKeyID(
        this.modelName,
        row.keyId,
        "ById",
        this.editCallback
      );
    },
    // 编辑按钮回调事件
    editCallback: function(isSuccess, json) {
      if (isSuccess) {
        // this.curCommand = "PartialUpdateProc";
        this.UpdateOrSave = "/api/subAsset/update";
        this.isShowEditForm = true;
        if (this.$refs["editForm"]) {
          this.$refs["editForm"].resetFields();
        }
        // this.dataForm = json;
        this.editForm.keyId = json.keyId;
        this.editForm.version = json.version,
        this.editForm.assetId = json.assetId,
        this.assetCode = json.assetEntity.assetCode;
        this.assetName = json.assetEntity.assetName;
        this.editForm.subassetCode = json.subassetCode;
        this.editForm.subassetName = json.subassetName;
        this.editForm.subassetNum = json.subassetNum;
        this.editForm.subassetDefinition = json.subassetDefinition;
        this.editForm.absoluteUrl = json.absoluteUrl;
        this.editForm.timeLength = json.timeLength;
        this.editForm.isFee = json.isFee;
        this.editForm.contentType = json.contentType;
        this.editForm.videoHorpic = json.videoHorpic;
        this.editForm.fileSize = json.fileSize;
        this.editForm.videoType = json.videoType;
        this.imageUrl = json.videoHorpic;
        this.editForm.approvalStatus = "PendingReview";
        this.editForm.sendtoState = "StayDown";

        this.isShow = true;
        //this.canEditCode = true;
      } else {
        this.$message({
          message: this.$i18n.t("errorCode." + json.reason, json.message),
          type: "warning"
        });
      }
    },
    // 提交编辑面板数据
        submitForm1: function submitForm(formName,currentResCode) {
            var _this = this;

            this.$refs[formName].validate(function (valid) {
                if (valid) {
                    _this.loading = true;
                    _this.procCommand(_this.curCommand,
                    _this.modelName,
                    "Default",
                    _this.editForm,
                    null,
                    _this.submitFormCallback);
                } else {
                    return false;
                }
            });
        },
    // 详情按钮点击事件
    editDetails: function(index, row,rescode) {
        this.currentResCode = (rescode && rescode!=='') ? rescode : '';
            this.queryModelByKeyID(this.modelName,row.keyId,"Query",this.editDetailsCallback);
            this.reviewQueryCondition.code.val = row.keyId;//资产id
            this.reviewQueryCondition.type.val = "SUBASSET";
            this.reviewQueryCondition.assetName.val = row.subassetName;
      },
    //详情时回调事件
    editDetailsCallback: function(isSuccess, json) {
        this.isShowDetails = true;
        this.dataForm = json;

        this.canEditCode = true;
    },

    //单个下发删除
    onSendDel: function(index, row, rescode) {
        var _this = this;
        this.currentResCode = (rescode && rescode!=='') ? rescode : '';
        this.commandArgs = "DELETE";
        this.sendType = "single";
        this.singleSend = {};
        let dataList = [];//最终传给后台的总数据
        let data2 = {
          "keyId":row.keyId,
          "assetId":row.assetId,
          "version":row.version,
          "sendtoState":"DownAlready",
        };
        this.singleSend = data2;
        let siteListJson = [];//站点的数据
        // for (let i=0;i<this.assetData.length;i++){
        //     let siteId = this.assetData[i];
        //     let resType = "J";
        //     let state = "Untreated";
        //     let data = {"siteId":siteId,"resType":resType,"state":state};
        //     siteListJson.push(data);
        // };
        // this.singleSend.siteList = siteListJson;
        dataList.push(this.singleSend);
        this.$confirm(this.$i18n.t("message.confirmSendMessage"),
            this.$i18n.t("message.confirmTitle"), {
            confirmButtonText: this.$i18n.t("message.yes"),
            cancelButtonText: this.$i18n.t("message.cancel"),
            type: "warning",
            callback: function (action, instance) {
                if (action == "confirm") {
                    _this.loading = true;
                    _this.procCommand("MediaToCdnProc",
                    _this.modelName,
                    _this.commandArgs,//操作类型 注册一REGIST 更新一UPDATE 删除一DELETE
                    {
                      "assetId":_this.curRootAssets.assetId,
                      "dataList":dataList,
                    },
                    null,
                    _this.submitFormCallback);
                }
            }
        });
    },

    //单个下发更新
    onSendUpdate: function(index, row, rescode) {
        var _this = this;
        this.currentResCode = (rescode && rescode!=='') ? rescode : '';
        this.commandArgs = "UPDATE";
        this.sendType = "single";
        this.singleSend = {};
        let dataList = [];//最终传给后台的总数据
        let data2 = {
          "keyId":row.keyId,
          "assetId":row.assetId,
          "version":row.version,
          "sendtoState":"DownAlready",
        };
        this.singleSend = data2;
        let siteListJson = [];//站点的数据
        // for (let i=0;i<this.assetData.length;i++){
        //     let siteId = this.assetData[i];
        //     let resType = "J";
        //     let state = "Untreated";
        //     let data = {"siteId":siteId,"resType":resType,"state":state};
        //     siteListJson.push(data);
        // };
        // this.singleSend.siteList = siteListJson;
        dataList.push(this.singleSend);
        this.$confirm(this.$i18n.t("message.confirmSendMessage"),
            this.$i18n.t("message.confirmTitle"), {
            confirmButtonText: this.$i18n.t("message.yes"),
            cancelButtonText: this.$i18n.t("message.cancel"),
            type: "warning",
            callback: function (action, instance) {
                if (action == "confirm") {
                    _this.loading = true;
                    _this.procCommand("MediaToCdnProc",
                    _this.modelName,
                    _this.commandArgs,//操作类型 注册一REGIST 更新一UPDATE 删除一DELETE
                    {
                      "assetId":_this.curRootAssets.assetId,
                      "dataList":dataList,
                    },
                    null,
                    _this.submitFormCallback);
                }
            }
        });
    },

  /////下载导入模板
    downloadTemplate: function downloadTemplate () {
      this.downloadByIdOrName(this, '/import/downtemplate', 'fileName', '资产剧集信息导入模板.xlsx', '资产剧集信息导入模板.xlsx');
    },

 // 导出
     onExport:function onExport (rescode) {
      this.currentResCode = (rescode && rescode!=='') ? rescode : '';
      let param = {
        'className': 'com.ispr.iptv.entity.media.SubAssetEntity',
         'opKey': 'Export',
         'params': [
           { 'key': 'assetId', 'val': this.curRootAssets, 'op': '=', 'group': '' },
           { 'key': 'isEnable', 'val': "Available", 'op': '=', 'group': '' }
         ],
         'sort': [{ 'col': 'keyId', 'order': 'desc' }],
         'fileName': '调配资材' };
      let fileName = '资产剧集信息管理' + '.xlsx';
      this.downloadByIdOrName(this, '/file/export', 'param', JSON.stringify(param), fileName);
    },
    //回退事件
    back: function(isSuccess, json) {
        //this.$router.go(-1);//后退
        this.$parent.setCurrentComponent("goBack",null);
    },
    // 为q清晰度下拉框赋值
    findSharpness: function() {
        this.findByTypeCode("10012",this.setSharpness)
    },
    // 查询清晰度下拉框数据成功后的回调
    setSharpness: function(isSuccess,json) {
        try{
            if (isSuccess) {
                this.Sharpness = [];
                for (var i = 0; i < json.data.length; i++) {
                    this.Sharpness.push(json.data[i]);
                }
            }
            else {
                this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
            }
        }
        catch(e){
            alert(e);
        }
    },
    // 为资产状态下拉框赋值
    findApprovalStatus: function() {
        this.findByTypeCode("10007",this.setApprovalStatus)
    },
    // 查询资产状态下拉框数据成功后的回调
    setApprovalStatus: function(isSuccess,json) {
        try{
            if (isSuccess) {
                this.ApprovalStatus = [];
                for (var i = 0; i < json.data.length; i++) {
                    this.ApprovalStatus.push(json.data[i]);
                }
            }
            else {
                this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
            }
        }
        catch(e){
            alert(e);
        }
    },
    //定时方法，刷新高度------第五步
    initTable:function(){
    //alert("setTimeout");
    this.tableHeight = this.$refs.context.offsetHeight - this.$refs.queryBox.offsetHeight;
    this.isInit = true;
    },

    handleClick(tab, event) {
        if(tab.name=="second"){
            this.$refs.auditRecord.onQuery();
        }
    },
    renewRecord: function(){
        this.activeName = "first";
    },
    // 为内容类型下拉框赋值
    findContentTypeData: function() {
        this.findByTypeCode("10019",this.setContentTypeData)
    },
    // 查询内容类型下拉框数据成功后的回调
    setContentTypeData: function(isSuccess,json) {
        try{
            if (isSuccess) {
                this.contentTypeData = [];
                for (var i = 0; i < json.data.length; i++) {
                    this.contentTypeData.push(json.data[i]);
                }
            }
            else {
                this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
            }
        }
        catch(e){
            alert(e);
        }
    },
    // 为编码格式类型下拉框赋值
    findvideoTypeData: function() {
        this.findByTypeCode("10022",this.setvideoTypeData)
    },
    // 查询编码格式类型下拉框数据成功后的回调
    setvideoTypeData: function(isSuccess,json) {
        try{
            if (isSuccess) {
                this.videoTypeData = [];
                for (var i = 0; i < json.data.length; i++) {
                    this.videoTypeData.push(json.data[i]);
                }
            }
            else {
                this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
            }
        }
        catch(e){
            alert(e);
        }
    },
    // 为是否免费下拉框赋值
    findIsFeeData: function() {
        this.findByTypeCode("10020",this.setIsFeeData)
    },
    // 查询是否免费下拉框数据成功后的回调
    setIsFeeData: function(isSuccess,json) {
        try{
            if (isSuccess) {
                this.isFeeData = [];
                for (var i = 0; i < json.data.length; i++) {
                    this.isFeeData.push(json.data[i]);
                }
            }
            else {
                this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
            }
        }
        catch(e){
            alert(e);
        }
    },

    //数据表格内容回掉
    // setTableData: function(isSuccess,json) {
    //     if(isSuccess){
    //         this.curRootAssets = [];
    //                 for (var i = 0; i < json.list.length; i++) {
    //                     this.curRootAssets.push(json.list[i]);
    //                 }
    //         //this.$parent.setCurrentComponent("Assets",{curRootAssets:this.tableDatas,isNeedGoBack:true });
    //     }
    // },
  },

  mounted: function mounted() {
    this.findSharpness();
    this.findApprovalStatus();
    this.onQuery();
    this.findContentTypeData();
    this.findvideoTypeData();
    this.findIsFeeData();
    //第六步
      window.setTimeout(this.initTable,100);
    //alert(this.isNeedGoBack);
    //alert(this.curRootAssets);
    //this.formQueryCondition.shellCode.val = this.$route.params.code;
    //this.formQueryCondition.shellName.val = this.$route.params.name;

  },
  components:{
      "subAssets-info": subAssetsInfo,
      "audit-record": auditRecord,
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style scoped>
.main{
    height: 100%;
    width: 100%;
    font-size: 14px;
    color: #333333;
    font-family:"Microsoft YaHei";

}
.datarow {
    border: 1px solid #eeeeee;
    padding: 0px 0px 0px 0px;
    margin-bottom: 0px;
    &:last-child {
      margin-bottom: 0;
    }
  }

.titlecol{
    font-weight: bold;
}

.labcol {
  padding: 3px 3px 3px 5px;
  border-radius: 4px;
  font-size: 14px;
  text-align:right;
  border-right: 1px solid #eeeeee;
}

.datacol {
  padding: 3px 3px 3px 3px;
  border-radius: 0px;
  text-align:left;

vertical-align: middle;
  border-right: 1px solid #eeeeee;
}

.bgrow{
    background-color: #d4f1ff;
}
</style>
